<template>
  <!-- MemberInfoApplyAudit 资料变更审核 -->
  <PageContainer>
    <view class="container">
      <Header title="资料变更审核" />
      <template v-if="apiIsInit">
        <ApplyForm
          :form-item-map="formItemMap"
          :answer-list="answerList"
          :disabled="true"
          @on-load="formOnload"
        />
      </template>
      <BasicsForm
        v-if="!loading"
        :schemas="schemas"
        disabled
        :label-width="120"
        :btn-group-options="{}"
      >
        <template #dynamicSlot="{ model, field }">
          <OfficialAccount share-type="View" padding="0px" />
        </template>
      </BasicsForm>

      <TButtonGroup v-if="!loading && !info?.auditStatus">
        <TButton
          class="gutter-btn"
          type="warn"
          text="驳回"
          :icon="'\ueaf2'"
          @click="showModal('reject')"
        />
        <TButton
          class="gutter-btn"
          type="primary"
          text="通过"
          :icon="'\ue60d'"
          @click="showModal('pass')"
        />
      </TButtonGroup>

      <FullLoading :full-loading="loading" />

      <ShowModal
        v-model="modalVisible"
        :title="modalTitle"
        content-width="100%"
        :confirm-text="modalConfirmText"
        :confirm-color="modalConfirmColor"
        @confirm="onSubmit"
      >
        <template #content>
          <view class="pa-20" style="width: 100%">
            <view style="background-color: #f2f3f5">
              <UniEasyinput v-model="remark" type="textarea" placeholder="请输入审核说明" />
            </view>
          </view>
        </template>
      </ShowModal>

      <AuditedReminder
        v-if="!loading && info?.auditStatus !== AuditStatusEnum.CHECKPENDING"
        @back="reLaunch({ name: 'memberAudit' })"
      />
    </view>
  </PageContainer>
</template>

<script lang="ts" setup>
  /**  MemberInfoApplyAudit  资料变更审核 */
  import PageContainer from '@/components/PageContainer/index.vue';
  import { memberInfoApplyDetails, memberInfoApplyReview } from '@/api/admin';
  import { type FormItemVoMapItem } from '@/api/membership/formCompTypes';
  import { type customFormUserAnswerList } from '@/api/membership/types';
  import Header from '@/components/Header/index.vue';
  import { navigateBack, onLoad, reLaunch } from '@/router';
  import { ref } from 'vue';
  import ApplyForm from '../components/applyForm.vue';
  import FullLoading from '@/components/FullLoading/index.vue';
  import BasicsForm from '@/components/Form/BasicsForm.vue';
  import { type MemberInfoApplyDetailsResult } from '@/api/admin/types';
  import { AuditStatusEnum, MemberApplyFormReviewStatusEnum } from '@/enums/membershipEnum';
  import { Toast } from '@/utils';
  import OfficialAccount from '@/components/OfficialAccount/index.vue';
  import { onShareAppMessage } from '@dcloudio/uni-app';
  import { useAppStoreWithOut } from '@/store/modules/app';
  import { ShareTypeEnum } from '@/enums/shareEnum';
  import { type MemberApplyFormAudit } from '@/router/types/modules';
  import { type FormSchema } from '@/components/Form';
  import TButtonGroup from '@/components/TButtonGroup/index.vue';
  import TButton from '@/components/TButtonGroup/TButton.vue';
  import ShowModal from '@/components/ShowModal/index.vue';
  import UniEasyinput from '@/uni_modules/uni-easyinput/components/uni-easyinput/uni-easyinput.vue';
  import AuditedReminder from '../components/AuditedReminder.vue';
  import { useAppShare } from '@/hooks/core/useAppShare';

  const { hasShareImgConfig } = useAppStoreWithOut();
  const { setWxSharePath } = useAppShare();

  const loading = ref(true);
  const apiIsInit = ref(false);
  let refresh: MemberApplyFormAudit['refresh'];
  const id = ref<number>();
  const formItemMap = ref<FormItemVoMapItem>({});
  const answerList = ref<customFormUserAnswerList[]>([]);
  const info = ref<MemberInfoApplyDetailsResult>();
  const statusLocaldata = ref([
    {
      value: MemberApplyFormReviewStatusEnum.AUDITED,
      text: '通过',
    },
    {
      value: MemberApplyFormReviewStatusEnum.REFUSAL,
      text: '驳回',
    },
  ]);

  const schemas = ref<FormSchema[]>([]);

  function getDetails() {
    return (
      id.value &&
      memberInfoApplyDetails(id.value).then((r) => {
        info.value = r;
        const { customFormItemMap, customFormUserAnswerList } = r.infoData;
        formItemMap.value = customFormItemMap;
        answerList.value = customFormUserAnswerList;
        schemas.value = [
          {
            field: 'managerhandle',
            label: '管理员操作',
            component: 'Divider',
          },
          {
            field: 'companyName',
            label: '会员名称',
            component: 'Input',
            defaultValue: r?.memberName,
            dynamicDisabled: true,
          },
          {
            field: 'tianyanchaScore',
            label: '单位综合评分',
            component: 'TianyanchaScore',
            defaultValue: r.companyId,
          },
          {
            field: 'policyService',
            label: '单位政策服务',
            component: 'PolicyService',
            defaultValue: r?.companyName,
          },
          ...(r.auditStatus
            ? ([
                {
                  field: 'status',
                  label: '资料变更审核',
                  component: 'RadioGroup',
                  required: true,
                  defaultValue: r?.auditStatus || AuditStatusEnum.AUDITED,
                  componentProps: {
                    localdata: statusLocaldata.value,
                  },
                },
                {
                  field: 'remark',
                  label: '备注',
                  component: 'InputTextArea',
                  defaultValue: r?.remark,
                  itemProps: {
                    labelPosition: 'top',
                  },
                },
              ] as FormSchema[])
            : []),
          {
            field: 'dSlot',
            label: '',
            labelWidth: '0px',
            component: 'Input',
            slot: 'shareView',
          },
        ];
        apiIsInit.value = true;
      })
    );
  }

  function formOnload() {
    loading.value = false;
  }

  const modalVisible = ref(false);
  const modalTitle = ref('');
  const modalConfirmText = ref('');
  const modalConfirmColor = ref('');
  const status = ref<MemberApplyFormReviewStatusEnum>(MemberApplyFormReviewStatusEnum.AUDITED);
  const remark = ref('');
  function showModal(type: 'pass' | 'reject') {
    if (type === 'pass') {
      modalTitle.value = '确定资料无误，审核通过？';
      modalConfirmText.value = '审核通过';
      modalConfirmColor.value = '#2878FF';
      status.value = MemberApplyFormReviewStatusEnum.AUDITED;
      modalVisible.value = true;
    }
    if (type === 'reject') {
      modalTitle.value = '确定要驳回申请？';
      modalConfirmText.value = '驳回申请';
      modalConfirmColor.value = '#EA5E0E';
      status.value = MemberApplyFormReviewStatusEnum.REFUSAL;
      modalVisible.value = true;
    }
  }

  function onSubmit() {
    id.value &&
      memberInfoApplyReview({
        id: id.value,
        status: status.value,
        remark: remark.value,
      })
        .then(() => {
          Toast({
            title: '审核成功',
            mask: true,
            success: () => {
              navigateBack();
              refresh?.();
            },
          });
        })
        .finally(() => (remark.value = ''));
  }

  onShareAppMessage(() => {
    const tencentCode = hasShareImgConfig(ShareTypeEnum.tencentCode);
    return {
      path: setWxSharePath({ name: 'tencentCode' }),
      imageUrl: tencentCode?.iconUrl,
      title: tencentCode?.desc,
    };
  });

  onLoad<'MemberInfoApplyAudit'>((op) => {
    id.value = op.id;
    refresh = op.refresh;
    getDetails();
  });
</script>

<style lang="scss" scoped></style>
